<template>
  <div class="container">
    <div class="box">
      <swiper :lunbotulist="lunbotulist"></swiper>
    </div>
    <div class="box"></div>
    <div class="box"></div>
  </div>
</template>

<script>
import Swiper from "../subcomponent/Swiper"
export default {
  data: () => ({
    id: 0,
    lunbotulist:[]
  }),
  created(){
    this.id = this.$route.params.id;
    this.getlunbotu();
  },
  components: {
    Swiper 
  },
  methods:{
    async getlunbotu(){
      // 因为当前id是101开始，但是我们传递过来的是1
      let id = parseInt(this.id) + 100;
      const {
        body:{status,message}
      } = await this.$http.get("api/getthumimages/" + id);
        if(status === 0){
           
           message.forEach(item=>{
             item.img = item.src
           })
          
          this.lunbotulist = message;
          console.log(message)

        }

    }
  }
};
</script>

<style lang="less" scoped>
  .container {
    background-color: #eee;
    .box{
      width: 96%;
      height:200px;
      background-color: #ccc;
      border: 1px solid pink;
      margin: 0 auto;
      margin-top:8px;
    }
  }
  .demo-swipe {
  height: 200px;
  overflow: hidden;
  width: 100%;
  .item {
    img {
      width: 100%;
      height: 100%;
    }
  }
}
</style>